<#assign ctx=request.contextPath />
<!DOCTYPE html>
<html>
	<head>
		<base id="ctx" href="${ctx}">
		<meta charset="UTF-8">
		<title>小区列表</title>
		<link rel="stylesheet" href="${ctx}/css/dataCenter/community/community.css" />
		<link rel="stylesheet" href="${ctx}/layui/css/layui.css" />
	</head>
	<body>
		<div class="header">
			<div class="permission">
				<h1>小区列表</h1>
			</div>
			<div class="show">
				<div class="manage">
					<a class="layui-btn  add" >添加</a>
					<a class="layui-btn   del">导入</a>
				</div>
				<div class="demoTable" style="margin-left: 80%;">
					搜索ID：
					<div class="layui-inline">
						<input class="layui-input" name="id" id="demoReload" autocomplete="off">
					</div>
					<button class="layui-btn" data-type="reload">搜索</button>
				</div>
				<table id="demo" lay-filter="test"></table>
				<script src="${ctx}/layui/layui.js"></script>
				<script src="${ctx}/layui/layui.all.js" ></script>
				<script>
                    layui.use('table', function() {
                        var table = layui.table;
                        //第一个实例
                        table.render({
                            elem: "#demo",
                            url: 'communityData',
                            page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                                //,curr: 5 //设定初始在第 5 页
                                ,
                                groups: 1 //只显示 1 个连续页码
                                ,
                                first: false //不显示首页
                                ,
                                last: false //不显示尾页
                            },
                            cols: [
                                [{
                                    field: "id",
                                    title: 'id'
                                },
                                    {
                                        field: "name",
                                        title: '小区名称'
                                    },
                                    {
                                        field: "address",
                                        title: '所在地区'
                                    },
                                    {
                                        field: "detailaddress",
                                        title: '详细地址'
                                    },
                                    {
                                        field: "servicetel",
                                        title: '服务热线'
                                    },
                                    {
                                        field: "leader",
                                        title: '负责人'
                                    },
                                    {
                                        field: "leaderphone",
                                        title: '负责电话'
                                    },
                                    {
                                        field: "logo",
                                        title: '小区Logo'
                                    },

                                    {
                                        field: "backgroundimage",
                                        title: '背景图片'
                                    },
                                    {
                                        field: "right",
                                        title: '编辑',
                                        align: 'center',
                                        toolbar: "#barDemo"
                                    }
                                ]
                            ],
                            page: true
                        });
                        //删除
                        table.on('tool(test)', function(obj) {
                            var data = obj.data; //获得当前行数据
							console.log(data.id+1);
                            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
							 console.log(layEvent);
                            var tr = obj.tr; //获得当前行 tr 的DOM对象
							console.log(tr);
                            if(layEvent === 'del') {
                                layer.confirm('确定要删除吗?', {
                                    icon: 3,
                                    title: '提示',
                                    shade: '0'
                                }, function(index) {
                                    $.ajax({
                                        url: 'delectCommunity',
                                        type: 'get',
                                        dataType: 'json',
                                        data: {
                                            id: data.id
                                        },
                                        success: function(data) {
                                            if(data == 1) {
                                                layer.msg('删除成功', {
                                                    icon: 1
                                                });
                                                obj.del();
                                                layer.close(index);
                                            } else {
                                                layer.msg('删除失败', {
                                                    icon: 2
                                                });
                                            }
                                        }
                                    })
                                });
                            }
                        });
                    });
				</script>
				<script type="text/html" id="barDemo">
					<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
					<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
				</script>
			</div>
		</div>
	</body>

</html>